<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        .fl {
            float: left;
        }

        .fr {
            float: right;
        }

        li {
            list-style: none;
        }

        img {
            display: block;
            width: 100%;
            height: 100%;
        }

        .header {
            height: 65px;
        }

        .logo {
            /* position: absolute; */
            /* top: 18px;
            left: 65px; */
            width: 216px;
            height: 30px;
            margin: 18px 0 0 65px;
        }

        .nav {
            /* position: absolute; */
            /* top: 25px;
            right: 80px; */
            margin: 25px 80px 0 0;
        }

        .nav li {
            float: left;
            margin-left: 40px;
            font-size: 12px;
            line-height: 12px;
        }

        .bg-main {
            position: relative;
            top: 0;
            left: 0;
            /* height: 524px; */
            /* margin-top: 65px; */
            /* background: url(./美团打车/images/Banner.jpg) no-repeat top center; */
        }

        .bg-main a {
            position: absolute;
            bottom: 44px;
            /* right: 50%; */
            /* margin-right: 25px; */
            width: 70px;
            height: 7px;
            background-color: #fff;
        }

        .bg-main .tag-a {
            /* position: absolute; */
            /* bottom: 44px; */
            right: 50%;
            margin-right: 25px;
            /* width: 70px;
            height: 7px; */
            /* border-bottom: 7px solid #fff ; */
        }

        .bg-main .tag-b {
            left: 50%;
            margin-left: 25px;
        }

        .bg-main .selected {
            background-color: #fef200;
        }

        .content {
            padding-right: 60px;
        }

        .content .pic {
            width: 410px;
            height: 420px;
            margin: 0 80px;
        }

        .content h3 {
            height: 75px;
            font-size: 20px;
            line-height: 70px;
            text-align: center;
        }

        .content p {
            font-size: 16px;
            line-height: 20px;
            text-indent: 2em;
        }

        .content .msg-a,
        .content .msg-b {
            width: 250px;
            height: 50px;
            border: 1px solid #000;
            font-size: 14px;
            line-height: 50px;
            text-align: center;
            border-radius: 8px;
        }
        .content em{
            padding-left: 30px;
            font-style: normal;
            color: #3c87f5;
        }
    </style>
</head>

<body>
    <div class="header">
        <div class="logo fl"><img src="./美团打车/images/Header.png"></div>
        <ul class="nav fr">
            <li>车主招募</li>
            <li>乘客用车</li>
            <li>关于我们</li>
            <li>联系我们</li>
        </ul>
    </div>
    <div class="bg-main">
        <img src="./美团打车/images/Banner.jpg">
        <a href="#" class="tag-a selected"></a>
        <a href="#" class="tag-b"></a>
    </div>
    <div class="content">
        <div class="pic fl"><img src="./美团打车/images/1.jpg"></div>
        <h3>关于美团打车</h3>
        <p>美团打车是美团旗下网约车平台，于2017年2月正式上线，并开始在江苏南京试点运行。美团的使命是“帮大家吃得更好，生活更好”。作为中国领先的生活服务电子商务平台，公司拥有美团、大众点评、美团外卖、美团打车、摩拜单车等消费者熟知的App，服务涵盖餐饮、外卖、打车、共享单车、酒店旅游、电影、休闲娱乐等200多个品类，业务覆盖全国2800个县区市。
        </p>

        <p>打车业务源自美团用户需求驱动，平台用户存在出行需求，网约车业务能够帮助用户便捷实现“吃喝玩乐行”。</p>

        <p>美团打车致力于帮助用户提升出行效率，创造美好生活，将打车与平台吃喝玩乐优势相结合的营销方式，一直是美团打车深入探索的重点。美团打车将持续打通生态，在“出行+消费”的场景串联上创造协同，为用户提供更好体验，为行业注入创新动力。
        </p>
        <h3>客服热线</h3>
        <div class="msg-a fl">乘客 客服热线<em>101-001-66</em></div>
        <div class="msg-b fr">司机 客服热线<em>101-001-99</em></div>
    </div>


</body>

</html>